Intro

1. HTML Basics

2. CSS Basics

3. Hovers, Transitions, Shadows

4. Chrome DevTools & CSS Box Model

5. Text Styles

6. The HTML Structure

7. Images and Text Boxes

8. CSS Display Property

9. The div Element

10. Nested Layouts Technique

11. CSS Grid

12. Flexbox

13. Nested Flexbox

14. CSS Position

15. Position Absolute and Relative

16. Finish the Project

17. More CSS Features

Outro

Sync to video time

moses Fasanmi

Public

0/140

30.0 seconds

Continue clipping after ad finishes

Can't create clip while ad is playing

In this full course, we learn how to build websites with HTML and CSS, and get started as a software engineer. Exercise solutions: https://supersimple.dev/courses/html-... Copy of the code: https://supersimple.dev/courses/html-... HTML and CSS reference: https://supersimple.dev/html Lessons: 0:00 Intro 1:02 1. HTML Basics 17:42 2. CSS Basics 44:39 3. Hovers, Transitions, Shadows 1:03:10 4. Chrome DevTools & CSS Box Model 1:17:30 5. Text Styles 1:52:18 6. The HTML Structure 2:11:08 7. Images and Text Boxes 2:25:42 8. CSS Display Property 2:34:58 9. The div Element 2:46:55 10. Nested Layouts Technique 3:16:58 11. CSS Grid 3:43:58 12. Flexbox 4:15:21 13. Nested Flexbox 4:44:36 14. CSS Position 5:07:14 15. Position Absolute and Relative 5:33:49 16. Finish the Project 6:07:46 17. More CSS Features 6:30:21 Outro Additional Information: This HTML CSS full course is a series of HTML CSS tutorials, teaching the major skills that we need to create complex websites. Each HTML CSS tutorial builds on a project and provides some HTML CSS exercises to practice what we learned. By the end, we'll learn the basics of web development and we'll be on our way to becoming a web developer and software engineer. #htmltutorial #csstutorial #htmlcssfullcourse #html #css #tutorial #fullcourse #course #htmltutorial #csstutorial #htmlcsstutorial #htmlfullcourse #cssfullcourse #webdevelopment #advancedhtmltutorial #advancedcsstutorial #coding #codingtutorial #softwareengineer #softwareengineering #learntocode #supersimpledev

Intro

1. HTML Basics

2. CSS Basics

3. Hovers, Transitions, Shadows

#htmltutorial #csstutorial #htmlcssfullcourse

HTML & CSS Full Course - Beginner to Pro (2022)

475,835 views 5 Feb 2022 In this full course, we learn how to build websites with HTML and CSS, and get started as a software engineer. Exercise solutions: https://supersimple.dev/courses/html-... Copy of the code: https://supersimple.dev/courses/html-... HTML and CSS reference: https://supersimple.dev/html Lessons: 0:00 Intro 1:02 1. HTML Basics 17:42 2. CSS Basics 44:39 3. Hovers, Transitions, Shadows 1:03:10 4. Chrome DevTools & CSS Box Model 1:17:30 5. Text Styles 1:52:18 6. The HTML Structure 2:11:08 7. Images and Text Boxes 2:25:42 8. CSS Display Property 2:34:58 9. The div Element 2:46:55 10. Nested Layouts Technique 3:16:58 11. CSS Grid 3:43:58 12. Flexbox 4:15:21 13. Nested Flexbox 4:44:36 14. CSS Position 5:07:14 15. Position Absolute and Relative 5:33:49 16. Finish the Project 6:07:46 17. More CSS Features 6:30:21 Outro Additional Information: This HTML CSS full course is a series of HTML CSS tutorials, teaching the major skills that we need to create complex websites. Each HTML CSS tutorial builds on a project and provides some HTML CSS exercises to practice what we learned. By the end, we'll learn the basics of web development and we'll be on our way to becoming a web developer and software engineer. #htmltutorial #csstutorial #htmlcssfullcourse #html #css #tutorial #fullcourse #course #htmltutorial #csstutorial #htmlcsstutorial #htmlfullcourse #cssfullcourse #webdevelopment #advancedhtmltutorial #advancedcsstutorial #coding #codingtutorial #softwareengineer #softwareengineering #learntocode #supersimpledev

Intro

1. HTML Basics

2. CSS Basics

3. Hovers, Transitions, Shadows

4. Chrome DevTools & CSS Box Model

5. Text Styles

6. The HTML Structure

7. Images and Text Boxes

8. CSS Display Property

9. The div Element

10. Nested Layouts Technique

11. CSS Grid

12. Flexbox

13. Nested Flexbox

14. CSS Position

15. Position Absolute and Relative

16. Finish the Project

17. More CSS Features

Outro

Show less

27.1K subscribers

Comments

1.2K

Best HMTL AND CSS tutorial on YT . This course is way better than the paid ones.I watched many tutorials but this is the best tutorial. The way you explain is amazing.Thank you sir for making such a wonderful tutorial.Good Job

Shivansh Godiyal

12 days ago (edited)

Best HMTL AND CSS tutorial on YT . This course is way better than the paid ones.I watched many tutorials but this is the best tutorial. The way you explain is amazing.Thank you sir for making such a wonderful tutorial.Good Job

I A

(52 minutes in) Bro your channel is so good and underrated. I've watched many HTML, CSS, JavaScript courses on YouTube and this is by far one of the best if not the best I've ever come acrosss. The way you explain, the way you give exercises throughout, the notes/diagrams on screen and much more. I was shocked when I realised you only have 8k subscribers, I just assumed you were one of those channels with a few hundred thousand 🤣 seriously great stuff, keep it up!

Read more

·

Alee Asghar

The first ever course to ever complete and also would recommend this to every one also this dude has gone out of the box and provide not only this beautiful and descriptive concepts but also the best practices along with the exercises and solutions which goes to show how committed he is in teaching and give back to people for free. Higher power to you sire. KEEP it coming.

Read more

·

Fran Jacobo

Coming from the artistic side and being a complete novice wanting to make my own HTML portfolio I have started watching and abandoned many HTML/CSS courses, but this one is different and in my opinion the best I have seen. This is why: 1. No fuss or annoying showman youtuber style (much appreciated). 2. Amazing structure of the lessons with useful exercises, starting with simple buttons and tags, and only after 2 hours in when you have all the basics assimilated you will learn how to structure an HTML file and link CSS stylesheets, and a few other fancy extensions for Visual Studio Code, avoiding being overwhelmed with too much too soon. Just perfect. 3. The "HTML CSS Reference" PDF to consult and refresh everything you learn during the course, a perfect complement for the visual lessons. 4. The how and why of things and where to find the knowledge you don't have. 5. No cliffhanger low-key forcing you to buy the extended edition at the end of the course to get that final nugget of information you surely need. Thank you Simon, I hope your channel grows as it deserves.

Read more

·

Peter H

Very happy to give your comment a thumbs up because I agree 100%. I too have tried to follow other video tutorials as well as a few written ones but they end up losing me because they often tell you what code to enter, but fail to explain why as clearly as Simon manages to. They also seem to forget what it's like to be a complete beginner and give information that requires a little prior knowledge to fully understand. It's also great that we get a taste of CSS at the same time as HTML so we can understand how the two work in conjunction with one another, instead of focusing purely on HTML first and the styling second. Added to all that is Simon is a realist and hasn't made ridiculous claims by making a twenty minute video with a silly title such as "Everything you need to know about HTML and CSS". I'll bet anything you like that the creators of such videos didn't learn all they know by watching a brief introduction to the subject. This tutorial hasn't been around long, but I reckon in another six months or so it will be one of the most viewed and liked.

Read more

1 month ago (edited)

Thanks for taking the time to write such a nice comment! I will take your comments to heart and continue making these videos in this style and try to provide the best education that I can!

Haveeen Vlogs

@SuperSimpleDev Yes! Thank you I always watch ads so I help you too. Please make some tutorial again. About PHP, SQL and any languages

Shadon_official

Couldn’t have said it any better!

OldSchoolFuture

100%, Thank you Simon. You are a god.

RNZ Sea

You did an extremely great job explaining these topics. You have best tutorial on YouTube and your teaching style is excellent. I am looking forward to more of your tutorials! 👍💯

Ben Hulme

Simply fantastic. I am two and a half hours in and loving the system, teaching style and exercises. I saw you mention below there is a JavaScript video in the same style coming up, can't wait for that. Thank you, Subscribed!

Didi

I've watched quite a number of html and CSS courses on yt but this one is the best Well explained The exercises are well put together and the project is very good

·

Ayooo

Love how we jump into creating things right away, creating the buttons set a great foundation to learn everything else. You start to know how to do things before he even explains it. Amazing video !

Joseph Motto

I am 3 hours and 16 minutes into this (watched and done the exercises over the course of the last 3 days). This course is better than paid ones. Love your exercises at the end of each lesson. The way you break things down is excellent.

b king

Wow. I took a semester of HTML, CSS, JavaScript at my community college. Your 6 hour course put it all together for me. Can’t wait to watch your JavaScript course! You teach in a very methodical, progressive manner in which people like me, who have a BS degree and attend community college for fun, understand.

Anime Uncaged

Decided to watch this just to refresh my knowledge, to be honest, I always knew I was missing something with HTML and CSS even though I have been using it for the past two years, you’ve really opened my eyes on a lot of concepts man, can’t thank you enough.

Sabrina Summers

Criminally underrated. This tutorial is layed out in a way where you actually practice and apply the knowledge you learn gradually as you accumulate it which is something many tutorials lack. This is very important because that's what makes the knowledge stick in your head. Your teaching style is clear and straight forward. You can tell there is a lot of effort put in the video. Please make more of these long form tutorials just like this! Subbed with a bell. I'll make sure to see your other tutorials too! Keep it up!

Read more

·

J 6

Honestly, this is the best course I've come across after gaining some fundamental basic knowledge from theory study. You've covered a lot of things in depth that have just completed the picture for me. I would happily pay for future courses of yours, given your reputation from this video alone is great. Thank you very much and I look forward to your JavaScript video to come

·

Thanks for your support 😄 I'm happy you enjoyed it and I'll definitely be making more courses in the future

PNG FUNNY

Really it helps me. Thank you for your teachings.

Bryan Ang

I'd just finished the course, and this is the best tutorial I watch ever, I learn a ton from here, and I truly appreciate all the effort you have made! I hope you will make a Python course as well, I'm very sure can learn a lot from your video. keep it up!!!

Liaqat Ali Karnachi

I have gone thorough this simple yet effective course as a beginner. There was no confusion and no doubt all through the video. The lucid and unhurried way in which you have explained makes it one of the best. Great job. Please keep it up and add more such training videos.

Arby Danyelians

An hour and 45 mins in and I already know way more than I did from an entire semester at the University! I can't thank you enough!

huma huma

This is the best ever HTML and CSS tutorial I have watched. I loved your teaching approach. Thanks for you effort.

shinylys

Almost 3 hours in - This is an amazing course!! So easy to follow. The way you explain every element and the repetition you use is especially helpful.

KM Doll

I am 2 hours in and omg, this is the easiest way to learn out of all the other vids I have come across... thanks for making this. Cant wait for js and python django videos.

Frank Liva

such a calm explanation. almost felt like a guided meditation :D you did a really good job mate!

Packers718

Thank you for creating this informative tutorial! I'm currently an hour into the video and I must say that this is one of the best tutorials I've seen.

·

J A

Finally, after 20+ hours spread over a couple of days, I've completed your course. I went to further lengths by going deeper into each concept. Now, I am super confident with my fundamental HTML & CSS skills. Thank you very much for the video bro! This is such a blessing! Thank you! 🙏

·

That's amazing! Yea, that's the most important part actually: for you to learn the fundamental process of converting designs into code, and then feeling confident to grow and learn more deeply on your own!

Nika Sikharulidze

He's jumping right into CSS, is that a correct and better approach ? I want to know because i am just starting out. Is it better than Odin Project ?

J A

@Nika Sikharulidze Hi, I completed this course in preparation for a BootCamp. Now, I just finished my week 3 and I can say that this tutorial helped me get ahead. I believe Odin Project is like a BootCamp level. So, doing this before starting your journey wouldn't hurt. What I like about this tutorial is that you can see the final result immediately - and it's of high quality too. I needed that kind of achievement to boost my confidence, to prove to myself "yeah, I can do it".

Show less

Nika Sikharulidze

@J A thanks bud

Matheus Manfredini

1 month ago (edited)

man, that's the best tutorial of HTML and CSS that I've ever seen!! thank you, you are awesome!!!

À Human

Very well explained, I recommend everyone following this video to also keep w3school's HTML and CSS pages open on the side, to get more context or learn more about each of the properties mentioned. The best part of this video is it's very upto date and keeps you interested to keep watching. Good job :)

Show less

·

Yes, great idea. The video teaches overall strategies for creating web pages, but it's impossible to cover every little detail so it's good to have a reference handy that explains those details

Nika Sikharulidze

He's jumping right into CSS, is that a correct and better approach ? I want to know because i am just starting out.

Gourav

4 weeks ago (edited)

@Nika Sikharulidze i would suggest you watch a 2-3 hour long html course 1st and practice html. most html video tutorials have a html project in end. once ur able to make 2 projects by ur own, start this video. that way u will know whats happening in html side and this vid covers css side pretty good. if u feel little lost in css side u can watch 3-4 hrs long vid on css only and then come back here. but make sure u watch this one. the exercises after every lesson make this video worth it. u can always come back to these exercises to check how u did what u did

Read more

Vincent Hayes

Simon has been putting a ton of time into this, clearly. Very thankful for you sir.

·

Felipe Leon

thank you very much man, this is for real an amazing tutorial. Outstanding, everything very clear and precise

Shubham Patil

best course I found on this planet to learn html and css. what makes it great is your explanation style and exercises. I have watched many tutorials but I never got that feeling of progressing that I got here. You are simply great.🧡

·

Reman Balak

I just want to appreciate your hard work into putting a beautiful tutorial like this together. You deserve 100k+ subs! This video is VALUE!!!

Johann Taberlet

3 weeks ago (edited)

Simply amazing! Like others here, I came across a lot of different CSS courses and yours is the one that finally gave me a full understanding of this language. I subscribe and cross fingers to see more courses like this from you. Keep going on this and thanks a lot!

Bruno Uttempergher

i'm impressed with how you make it look simple to code. Thank you so much for the great content!

Shreyash Shah

1 day ago (edited)

Sir You are literally a legend Thought everything for free + Thought everything perfectly Need more people like you sir⭐⭐ Hatts off... Words are limited but feeling's aren't

Read more

Wesley Santos

Man, your course is wonderful! I'm learning a lot, I've seen several html and css courses for beginners, but I've never had success like I'm having now! Thank you very much, a big hug from Brazil!

·

syed imran

1 day ago (edited)

Amazing!!! I Loved this course. I promise, Nobody in this world could ever teach better than this. A "layman friendly" teaching. More than the course I learnt how to teach after watching his video. Wonderful Job, A very organized way of teaching. Hats off Sir!!! The level of detail he gives throughout the course is ultimate!!!

Tanou Chanhchaleun

I really like the way you are teaching this program. I like how you explain everything so well. Very detailed and informative. I hope you do more videos on other languages. Can you do a video on python?

Dylan Delorie

I know I might regret saying this, but how is this content free!! This was really well structured, edited, and very clear. You are a great resource! Keep it up (and free hopefully) 😅

·

santosh tamang

This is the best ever HTML and CSS tutorial I have watched. I loved your teaching approach. Thanks for you effort.

·

gangnamoppa

This is the best tutorial I've ever seen. Thank you so much!

Sean Anih

This is by far the best course on HTML/CSS I've seen. You truly covered all of the fundamentals in a way that made everything seem so easy and straight forward & I really appreciate it!

Relaxing & Dreaming Sounds

That is just a great course and a very good understanding. Thank you so much sharing it with us. 🙏🙏❤️

Issac Shaik

Sir, you're doing a wonderful work by providing all of this content for free. I was stuck in tutorial hell in CSS and I barely retained anything I've done during the Udemy courses but your style of teaching is like far more convenient to me than all the paid courses I've taken. Thank you, good sir. P.S - When's the Beginner to Pro Javascript course coming out?

Read more

·